<div class="wrap">
    <ul class="nav nav-tabs">
        <li class="active"><a href="#tab-base" data-toggle="tab">{:__('基本设置')}</a></li>
        <li><a href="#tab-custom" data-toggle="tab">{:__('设置样式')}</a></li>
    </ul>
    <form id="add-form" class="form-horizontal" role="form" data-toggle="validator" method="POST" action="">
        <input type="hidden" name="row[scenario]" value="add" />
        <div class="tab-content">
            <div class="tab-pane active" id="tab-base">
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('Name')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-title" class="form-control" type="text" name="row[name]" title="" data-rule="required">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('开始时间')}:</label>
                    <div class="col-xs-12 col-sm-3">
                        <input id="c-start_time" class="form-control datetimepicker" type="text" name="row[start_time]" title="" value="" data-date-format="YYYY-MM-DD HH:mm:ss" data-use-current="true" data-rule="required">
                    </div>
                    <label class="control-label col-xs-12 col-sm-2">{:__('结束时间')}:</label>
                    <div class="col-xs-12 col-sm-3">
                        <input id="c-end_time" class="form-control datetimepicker" type="text" name="row[end_time]" title="" data-date-format="YYYY-MM-DD HH:mm:ss" data-use-current="true" data-rule="required">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('可兑机会')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-chance_count" class="form-control" type="text" name="row[chance_count]" title="">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('兑换说明')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <textarea id="c-content" class="form-control" name="row[content]" title="" placeholder="" style="min-height: 240px"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('礼品限制')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        {:build_radios('row[gift_limit]', $limitList, null)}
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('校验方式')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        {:build_radios('row[only_number]', $yesOrNo, null)}
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('备注')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-note" class="form-control" type="text" name="row[note]" title="">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('Status')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        {:build_radios('row[status]', $statusList, null)}
                    </div>
                </div>
            </div>
            <div class="tab-pane" id="tab-custom">
                <div class="form-group">
                    <label for="c-login_top_img" class="control-label col-xs-12 col-sm-2">{:__('登录页图片')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <div class="input-group">
                            <input id="c-login_top_img" data-rule="required" class="form-control" size="50" name="row[login_top_img]" value="/assets/addons/yungift/img/card_login.jpg" type="text">
                            <div class="input-group-addon no-border no-padding">
                                <span><button type="button" id="faupload-login_top_img" class="btn btn-danger faupload" data-input-id="c-login_top_img" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false" data-preview-id="p-login_top_img"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                <span><button type="button" id="fachoose-login_top_img" class="btn btn-primary fachoose" data-input-id="c-login_top_img" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                            </div>
                            <span class="msg-box n-right" for="c-login_top_img"></span>
                        </div>
                        <ul class="row list-inline faupload-preview" id="p-login_top_img"></ul>
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('登录页底部备注')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <input id="c-login_note" class="form-control" type="text" name="row[login_note]" title="">
                    </div>
                </div>
                <div class="form-group">
                    <label class="control-label col-xs-12 col-sm-2">{:__('登陆页兑换提示')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <textarea id="c-tips" class="form-control" name="row[tips]" title="" placeholder="弹窗提示" style="min-height: 120px"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <label for="c-home_top_img" class="control-label col-xs-12 col-sm-2">{:__('兑换页图片')}:</label>
                    <div class="col-xs-12 col-sm-8">
                        <div class="input-group">
                            <input id="c-home_top_img" data-rule="required" class="form-control" size="50" name="row[home_top_img]" value="/assets/addons/yungift/img/card_home.jpg" type="text">
                            <div class="input-group-addon no-border no-padding">
                                <span><button type="button" id="faupload-home_top_img" class="btn btn-danger faupload" data-input-id="c-home_top_img" data-mimetype="image/gif,image/jpeg,image/png,image/jpg,image/bmp" data-multiple="false" data-preview-id="p-home_top_img"><i class="fa fa-upload"></i> {:__('Upload')}</button></span>
                                <span><button type="button" id="fachoose-home_top_img" class="btn btn-primary fachoose" data-input-id="c-home_top_img" data-mimetype="image/*" data-multiple="false"><i class="fa fa-list"></i> {:__('Choose')}</button></span>
                            </div>
                            <span class="msg-box n-right" for="c-home_top_img"></span>
                        </div>
                        <ul class="row list-inline faupload-preview" id="p-home_top_img"></ul>
                    </div>
                </div>
            </div>
        </div>
        <div class="form-group layer-footer">
            <label class="control-label col-xs-12 col-sm-2"></label>
            <div class="col-xs-12 col-sm-8">
                <button class="btn btn-success btn-embossed disabled" type="submit">{:__('OK')}</button>
                <button class="btn btn-default btn-embossed" type="reset">{:__('Reset')}</button>
            </div>
        </div>
    </form>
</div>

<style>
    .wrap {
        margin-top: 30px;
        display: flex;
    }
    .wrap .nav-tabs {
        width: 100px;
        margin-left: 50px;
        border-bottom: none;
    }
    .wrap .form-horizontal {
        flex: 1;
    }

    .nav-tabs > li > a, .nav-tabs > li > a:hover, .nav-tabs > li > a:focus {
        width: 100px;
        text-align: center;
        line-height: 2;
        border: 1px solid #ddd;
        background: #eee;
        color: #555555;
    }

    .nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
        border: 1px solid #ddd !important;
        font-weight: bold;
    }
</style>
